<template>
  <div class="rd-editor-view-content-footer-bar">
    <div class="content-actions-window">窗口</div>
    <div class="content-actions-container">
      <div class="content-actions-item" @click="actionItemClickHandle(item, index)" :class="[actionSelectedIndex == index ? 'selected' : null]" v-for="(item, index) in actions" :key="'content-actions-item-' + index" :title="item.tip">
        {{ item.label }}
      </div>
    </div>
  </div>
</template>

<script>
import './content-footer-bar.less'

export default {
  name: 'ContentFooterBar',
  data() {
    return {
      actions: [
        {
          label: '控制台',
          tip: '控制台输出信息'
        },
        {
          label: 'Console'
        },
        {
          label: '终端'
        },
        {
          label: 'Terminal'
        },
        {
          label: '构建'
        },
        {
          label: 'Build'
        }
      ],
      actionSelectedIndex: 0
    }
  },
  methods: {
    actionItemClickHandle(item, index) {
      this.actionSelectedIndex = index
    }
  }
}
</script>
